<template>
  <div>
      <insert-distributor @postInsert="queryByCondition"></insert-distributor>
    <el-form
      ref="searchForm"
      class="searchForm"
      :model="searchForm"
      label-width="50"
    >
      <el-row :gutter="12">
        <!--        合计24份  -->

        <el-col :span="8">
          <el-form-item
            prop="queryCondition.companyNameSimilar"
            label="公司名称"
          >
            <el-input
              v-model.trim="searchForm.queryCondition.companyNameSimilar"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item
            prop="queryCondition.supplyDescrSimilar"
            label="经营范围"
          >
            <el-input
              v-model.trim="searchForm.queryCondition.supplyDescrSimilar"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item
            prop="queryCondition.companyAddressSimilar"
            label="公司地址"
          >
            <el-input
              v-model.trim="searchForm.queryCondition.companyAddressSimilar"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-edit"
          @click="queryByCondition(1)"
          >查询</el-button
        >
        <el-button
          type="warning"
          icon="el-icon-remove"
          @click="() => $refs.searchForm.resetFields()"
          >重置</el-button
        >
      </el-form-item>
    </el-form>
    <!--  /**
      *  {
      "distributorId": 2,
      "distributorCode": "SS47775175000002",
      "companyName": "山西壶化集团股份有限公司",
      "companyAddress": "山西省太原市迎宾大道255号",
      "phoneNumber": "15589896363",
      "creditLevel": 0,
      "supplyDescr": "经营酒类,日常食品,油粮",
      "isDeleted": false
    },
      * */
      
      -->
    <el-table :data="results" class="resultsTable" stripe>
      <el-table-column prop="distributorId" label="ID/Code"></el-table-column>
      <el-table-column prop="distributorCode" label="ID/Code"></el-table-column>
      <el-table-column prop="companyName" label="公司名称"></el-table-column>
      <el-table-column prop="companyAddress" label="公司地址"></el-table-column>
      <el-table-column prop="phoneNumber" label="联系方式"></el-table-column>
      <el-table-column prop="supplyDescr" label="经营范围"></el-table-column>

      <el-table-column label="信用评级" :formatter="creditLevelFormat">
      </el-table-column>
      <el-table-column width="180px" fixed="left">
        <template slot-scope="props">
          <el-button
            class="el-button--mini"
            type="warning"
            icon="el-icon-edit"
            @click="openById(props.row.distributorCode)"
            >编辑</el-button
          >
          <el-button
            class="el-button--mini"
            type="danger"
            icon="el-icon-edit"
            @click="deleteById(props.row.distributorCode)"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      :total="total"
      :page-size="searchForm.pageSize"
      :current-page="searchForm.pageNum"
      @current-change="queryByCondition"
      layout="total, prev, pager, next, jumper"
    ></el-pagination>
  </div>
</template>

<script>
import { commodityModuleApi } from "@/api/apis";
import InsertDistributor from "@/components/InsertDistributor";

// import New from './components/New.vue';
export default {
  name: "GoodsSpplier",
  components: {
    InsertDistributor,
    // New,Old,
  },
  props: {
    sampleP: {
      type: Number,
      default: 0,
    },
  },
  data() {
    return {
      sampleD: "value",
      searchForm: {
        pageNum: 1,
        pageSize: 8,
        queryCondition: {
          companyAddressSimilar: null,
          companyNameSimilar: null,
          supplyDescrSimilar: null,
        },
      },

      results: [],
      total: 10,
    };
  },
  computed: {
    // sampleC() {
    //     return this.sampleD+'--';
    // }
  },
  created() {},
  mounted() {
    this.queryByCondition(1)
  },
  methods: {
    sampleM() {},
    queryByCondition(pageNum) {
      if (pageNum) this.searchForm.pageNum = pageNum;
      // this.$http({
      //   method: "post",
      //   url: "/distributor/query",
      //   data: this.searchForm,
      // })
      commodityModuleApi.distributorQueryApi(this.searchForm).then(
        (res) => {
          this.total = res.data.total;
          this.results = res.data.results;
        },
        (error) => {
          this.$message.warning("query mistake：" + error.response.status);
        }
      );
    },
    creditLevelFormat(row) {
      let l = row.creditLevel;
      if (l > 20) {
        return "五星商家";
      } else if (l > 5) {
        return "优质商家";
      } else if (l > -5) {
        return "一般商家";
      } else if (l > -20) {
        return "劣质商家";
      } else {
        return "不予合作";
      }
    },
  },
  watch: {
    // sampleC(newValue, oldValue) {
    //
    // }
  },
};
</script>

<!--<style scoped>-->
<style lang="scss" scoped></style>
